<!DOCTYPE html>
<html lang="zh-CN" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>代码生成器</title>
    <link rel="icon" type="image/svg+xml" href="/favicon.svg">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/font-awesome@4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <style>
        .sidebar {
            min-height: 100vh;
            background-color: #343a40;
        }
        .sidebar .nav-link {
            color: #fff;
        }
        .sidebar .nav-link:hover {
            background-color: #495057;
            color: #fff;
        }
        .sidebar .nav-link.active {
            background-color: #007bff;
            color: #fff;
        }
        .main-content {
            padding: 20px;
        }
        .feature-card {
            transition: transform 0.2s;
        }
        .feature-card:hover {
            transform: translateY(-5px);
        }
    </style>
</head>
<body>
    <div class="container-fluid">
        <div class="row">
            <!-- 侧边栏 -->
            <nav class="col-md-2 d-md-block sidebar collapse">
                <div class="position-sticky pt-3">
                    <div class="text-center mb-4">
                        <h4 class="text-white">代码生成器</h4>
                    </div>
                    <ul class="nav flex-column">
                        <li class="nav-item">
                            <a class="nav-link active" href="/">
                                <i class="fa fa-home"></i> 首页
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="/database-config">
                                <i class="fa fa-database"></i> 数据库配置
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="/template-config">
                                <i class="fa fa-file-code-o"></i> 模板配置
                            </a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" href="/code-gen">
                                <i class="fa fa-cogs"></i> 代码生成
                            </a>
                        </li>
                    </ul>
                </div>
            </nav>

            <!-- 主内容区 -->
            <main class="col-md-10 ms-sm-auto main-content">
                <div class="d-flex justify-content-between flex-wrap flex-md-nowrap align-items-center pt-3 pb-2 mb-3 border-bottom">
                    <h1 class="h2">欢迎使用代码生成器</h1>
                </div>

                <!-- 功能介绍 -->
                <div class="row">
                    <div class="col-lg-6 mb-4">
                        <div class="card feature-card h-100">
                            <div class="card-body">
                                <div class="d-flex align-items-center mb-3">
                                    <i class="fa fa-database fa-2x text-primary me-3"></i>
                                    <h5 class="card-title mb-0">数据库配置</h5>
                                </div>
                                <p class="card-text">
                                    配置MySQL数据库连接信息，支持多个数据库配置管理，可以测试连接是否正常。
                                </p>
                                <a href="/database-config" class="btn btn-primary">开始配置</a>
                            </div>
                        </div>
                    </div>

                    <div class="col-lg-6 mb-4">
                        <div class="card feature-card h-100">
                            <div class="card-body">
                                <div class="d-flex align-items-center mb-3">
                                    <i class="fa fa-file-code-o fa-2x text-success me-3"></i>
                                    <h5 class="card-title mb-0">模板配置</h5>
                                </div>
                                <p class="card-text">
                                    管理FreeMarker代码模板，包括Entity、Controller、Service、Mapper等模板的编辑和配置。
                                </p>
                                <a href="/template-config" class="btn btn-success">管理模板</a>
                            </div>
                        </div>
                    </div>

                    <div class="col-lg-12 mb-4">
                        <div class="card feature-card h-100">
                            <div class="card-body">
                                <div class="d-flex align-items-center mb-3">
                                    <i class="fa fa-cogs fa-2x text-warning me-3"></i>
                                    <h5 class="card-title mb-0">代码生成</h5>
                                </div>
                                <p class="card-text">
                                    选择数据库、表和模板，一键生成完整的Spring Boot后端代码，包括Entity、Controller、Service、Mapper接口和XML文件。
                                </p>
                                <a href="/code-gen" class="btn btn-warning">立即生成</a>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- 功能特性 -->
                <div class="row mt-5">
                    <div class="col-12">
                        <h3 class="mb-4">功能特性</h3>
                    </div>
                    <div class="col-md-4 mb-3">
                        <div class="d-flex align-items-start">
                            <i class="fa fa-check-circle text-success me-3 mt-1"></i>
                            <div>
                                <h6>自动代码生成</h6>
                                <small class="text-muted">根据数据库表结构自动生成完整的后端代码</small>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4 mb-3">
                        <div class="d-flex align-items-start">
                            <i class="fa fa-check-circle text-success me-3 mt-1"></i>
                            <div>
                                <h6>MyBatis XML支持</h6>
                                <small class="text-muted">生成MyBatis XML映射文件，支持完整的CRUD操作</small>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4 mb-3">
                        <div class="d-flex align-items-start">
                            <i class="fa fa-check-circle text-success me-3 mt-1"></i>
                            <div>
                                <h6>灵活配置</h6>
                                <small class="text-muted">支持选择特定表和模板，按需生成代码</small>
                            </div>
                        </div>
                    </div>
                </div>
            </main>
        </div>
    </div>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>